/**
 * Created by mapbar_front on 2019/8/2.
 */
import React,{Component} from 'react';
import HocPublic from './../HocPublic';

var DataSource = {
    getComments: function(){
        return [
            'comment1', 'comment2', 'comment3'
        ]
    }
}

function Comment(props){
    console.log('props',props);
    return(
        <div>
            {props.comment}
        </div>
    )
}

class Hoc extends Component{
    constructor(props){
        super(props);
        this.handleChange = this.handleChange.bind(this);
        this.state = {
            comments:DataSource.getComments()
        }
    }
    componentDidMount(){
        //DataSource.addChangeListener(this.handleChange);
    }
    componentWillUnmount(){
        //DataSource.removeChangeListener(this.handleChange);
    }
    handleChange(){
        this.setState({
            comments:DataSource.getComments()
        })
    }
    render(){
        console.log('this.state.comments',this.state.comments);
        return(
            <div>
                {
                    this.state.comments.map((comment)=>{
                        return <Comment comment={comment} key={comment.id}/>
                    })
                }
            </div>
        )
    }
}
export default Hoc;
